<template>
    <div class="rules flexv">
        <!-- 头部 -->
        <pubHead title="分销规则"></pubHead>

        <div class="box_area flexv">
            <img src="@/assets/fx_gz_title.png" class="title" alt="">

            <div class="article flexv flex1" v-html="info.content"></div>
        </div>

        <img src="@/assets/bg_z.png" class="bottom_img" alt="">

    </div>
</template>
<script>
import Vue from 'vue';
import pubHead from '@/components/head';
import { sharerule } from '@/request/api.js';
import { Toast } from 'vant';

Vue.use(Toast);
export default {
    data(){
        return{
            info: '', // 数据
        }
    },
    components: {
        pubHead,
    },
    created(){
        this.getData();
    },
    methods: {
        // 获取数据
        getData(){
            this.$loading();
            sharerule({
                token: localStorage.getItem('token')
            }).then(res =>{
                Toast.clear();
                if(res.code == 1){
                    this.info = res.data;
                }else{
                    this.$tip(res.msg);
                }
            })
        },
    }
}
</script>
<style lang="less" scoped>
.rules{
    min-height: 100vh;
    background:linear-gradient(0deg,rgba(252,101,47,1) 0%,rgba(253,156,105,1) 44%,rgba(253,196,106,1) 100%);
    .box_area{
        width: calc(100% - 0.6rem);
        height: 8.78rem;
        margin: 0.3rem auto 0;
        padding: 0.34rem 0.3rem;
        border-radius: 0.1rem;
        background-color: #fff;
        .title{
            width: 3.16rem;
            height: 1.06rem;
            margin: 0 auto;
        }
        .article{
            margin-top: 0.4rem;
            font-size: 0.28rem;
            line-height: 150%;
            color: #BE7E44;
            overflow-y: scroll;
            text-indent: 0.56rem;
        }
    }
    .bottom_img{
        width: 100%;
        height: 3.86rem;
        margin: 0 auto;
        position: fixed;
        z-index: 100;
        bottom: 0;
        left: 0;
        right: 0;
    }
}
</style>